<script setup>
defineOptions({
  name: 'AllCategory'
})
import { ArrowRight } from '@element-plus/icons-vue'
import { getAllClass } from '@/api/home.js'
import { onMounted, ref } from 'vue'
const goodsData = ref([])
onMounted(async () => {
  const res = await getAllClass()
  goodsData.value = res.result
    .map((item) => item.goods)
    .reduce((ac, cur) => ac.concat(cur), [])
})
</script>

<template>
  <div class="container py-5">
    <el-breadcrumb class="my-3" :separator-icon="ArrowRight">
      <el-breadcrumb-item to="/home">首页</el-breadcrumb-item>
      <el-breadcrumb-item :to="`/category/${$route.params.id}`">{{
        $route.query.cate
      }}</el-breadcrumb-item>
      <el-breadcrumb-item>{{ $route.query.sub }}</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="row row-cols-5">
      <goods v-for="item in goodsData" :key="item.id" :item="item"></goods>
    </div>
  </div>
</template>

<style scoped></style>
